<div class="layui-fluid tab-div">
    <div class="layui-card">
        <div id="body-div" class="layui-card-body">
        	<form id="searchForm" class="searchForm form-inline">
        		<div class="searchDiv positionSpc">
					<div class="form-group pull-left important">
						<span>名称</span>
						<input name="s01" component-type="input" class="form-control" type="text" value="" maxlength="64" />
					</div>
					<div class="form-group pull-left ">
						<span>行政区</span>
						<div name="area01.id" component-type="treeSelect" actionUrl="/sys/tagTree/areaTreeAsync" sync="false" check="false" chooseParent="true" class="tag-div"></div>
					</div>
					<div class="form-group pull-left ">
						<span>注册日期</span>
						<input name="beginD01" component-type="datePicker" readonly="readonly" onclick="WdatePicker({dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'endD01\')}'})" id="beginD01" class="Wdate form-control" type="text" value="" />
					</div>
					<div class="form-group pull-left">
						<span>至</span>
						<input name="endD01" component-type="datePicker" readonly="readonly" onclick="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'beginD01\')}'})" id="endD01" class="Wdate form-control" type="text" value="" />
					</div>
				</div>
        	</form>
        	<div id="toolbar" class="toolbar">
				<div class="pull-right">
					<a id="searchBtn" class="btn btn-success btn-bordered btn-sm"><i class="fa fa-search"></i> <font>查询</font></a>
					<a id="resetBtn" class="btn btn-success btn-bordered btn-sm"><i class="fa fa-refresh"></i> <font>重置</font></a>
					<a id="easySearch" class="btn btn-success btn-bordered btn-sm" style="display: none;"><i class="fa fa-backward"></i> <font>返回</font></a>
					<a id="hardSearch" class="btn btn-success btn-bordered btn-sm" style="display: inline-block;"><i class="fa fa-search-plus"></i> <font>高级查询</font></a>
				</div>
			</div>
            <div class="layui-tab layui-tab-brief proc-tab-div">
				<ul class="layui-tab-title">
					<li data-index="0" id="Unsent" class="layui-this">待发</li>
					<li data-index="1" id="TodoAndDoing">待办</li>
					<li data-index="2" id="Done">已办</li>
				</ul>
				<div class="layui-tab-content" style="padding: 0px;">
					<div class="layui-tab-item layui-show">
						<div class="proc-btn-div"></div>
						<table id="table-list-unsent"></table>
					</div>
					<div class="layui-tab-item v-hidden">
						<div class="proc-btn-div"></div>
						<table id="table-list-todoAndDoing"></table>
					</div>
					<div class="layui-tab-item v-hidden">
						<div class="proc-btn-div"></div>
						<table id="table-list-done"></table>
					</div>
				</div>
			</div>
        </div>
    </div>
</div>
<script>
    layui.use(['common', 'view', 'admin', 'laytpl'], function () {
        var $ = layui.$
            , R = layui.common
            , view = layui.view
            , admin = layui.admin
            , laytpl = layui.laytpl;

        var getTime = "-" + new Date().getTime();
        $("#body-div").attr("id", "body-div" + getTime);
        $("#table-list-unsent").attr("id","table-list-unsent" + getTime);
        $("#table-list-todoAndDoing").attr("id","table-list-todoAndDoing" + getTime);
        $("#table-list-done").attr("id","table-list-done" + getTime);

		var bootstrapTableUtilUnsent = new BootstrapTableUtil("-unsent"+getTime, "", getTime);
		bootstrapTableUtilUnsent.initProc({
			url: admin.basePath + '/dynamic/zform/data?path=Unsent&traceFlag=&formNo=demo_workflow',
			method: 'post',
			columns: [
				{
					field: 's01',
					title: '名称',
					sortable: true,
					sortName: 'a.name',
					
					formatter:function(value, row , index){
						if(!value){
							value = "";
						}
						return "<a href='javascript:;' class='view'>"+value+"</a>"+"<a class='qu-kuai-lian' data-id='"+row.hashKey+"' data-name='s01'><i class='fa fa-link'></i></a>";
					},
					events: {
						'click .view': function (e, value, row, index) {
							viewForm({
								id: row.id
								,hashKey: row.hashKey
							})
						}
					},
				},
				{
					field: 'area01.name',
					title: '行政区',
					sortable: true,
					sortName: 'a.administrative',
					
				},
				{
					field: 'd01',
					title: '注册日期',
					sortable: true,
					sortName: 'a.date_of_registration',
					
					formatter:function(value, row, index){
						return (typeof value == "undefined" || value == null || value == "") ? "" : moment(value).format('yyyy-MM-dd'.replace(/yy/g,"YY").replace(/dd/g,"DD"));
					},
				},
				{
					field: 'user01.name',
					title: '负责人',
					sortable: true,
					sortName: 'a.person_in_charge',
					
				},
				{
					field: 's03',
					title: '是否有效',
					sortable: true,
					sortName: 'a.is_it_effective',
					
					formatter:function(value, row , index){
						return myHelper.getValueFromDictionary("yes_no",value);
					},
				},
                {
                	title: layui.admin.lang() ? 'Operation' : '操作',
                	width: '45px',
					"class": 'center must',
					events: {
						'click .view': function (e, value, row, index) {
							viewForm({id: row.id,hashKey: row.hashKey})
						},
						'click .edit': function (e, value, row, index) {
							addOrEdit({
								id: row.id,
								hashKey: row.hashKey,
								procDefKey: row.procDefKey,
								paramStr: ProcUtil.getParamStr(row)
							})
						},
						'click .del': function (e, value, row, index) {
							delFuc(row);
						},
					},
					formatter: function(value, row, index) {
						return LayerUtil.getBtnsStrFromMenuData("",[{
							sign: "view",
							pageName: "查看",
							pageName_EN: "View"
						},{
							sign: "edit",
							pageName: "编辑",
							pageName_EN: "Edit"

						}]).tableBtnsStr;
					},
                },
            ],
		},"demo_workflow","unsent");

		var bootstrapTableUtilTodoAndDoing = new BootstrapTableUtil("-todoAndDoing"+getTime, "", getTime);
		bootstrapTableUtilTodoAndDoing.initProc({
			url: admin.basePath + '/dynamic/zform/data?path=TodoAndDoing&traceFlag=&formNo=demo_workflow',
			method: 'post',
			columns: [
				{
					field: 's01',
					title: '名称',
					sortable: true,
					sortName: 'a.name',
					
					formatter:function(value, row , index){
						if(!value){
							value = "";
						}
						return "<a href='javascript:;' class='view'>"+value+"</a>"+"<a class='qu-kuai-lian' data-id='"+row.hashKey+"' data-name='s01'><i class='fa fa-link'></i></a>";
					},
					events: {
						'click .view': function (e, value, row, index) {
							var returnData = ProcUtil.isCacheData(row);
							if (returnData.result) {
								LayerUtil.warning(returnData["message"+layui.admin.lang()]);
							} else {
								viewForm({id: row.id,hashKey: row.hashKey})
							}
						}
					},
				},
				{
					field: 'area01.name',
					title: '行政区',
					sortable: true,
					sortName: 'a.administrative',
					
				},
				{
					field: 'd01',
					title: '注册日期',
					sortable: true,
					sortName: 'a.date_of_registration',
					
					formatter:function(value, row, index){
						return (typeof value == "undefined" || value == null || value == "") ? "" : moment(value).format('yyyy-MM-dd'.replace(/yy/g,"YY").replace(/dd/g,"DD"));
					},
				},
				{
					field: 'user01.name',
					title: '负责人',
					sortable: true,
					sortName: 'a.person_in_charge',
					
				},
				{
					field: 's03',
					title: '是否有效',
					sortable: true,
					sortName: 'a.is_it_effective',
					
					formatter:function(value, row , index){
						return myHelper.getValueFromDictionary("yes_no",value);
					},
				},
                {
                	title: layui.admin.lang() ? 'Operation' : '操作',
                	width: '45px',
					"class": 'center must',
					events: {
						'click .view': function (e, value, row, index) {
							var returnData = ProcUtil.isCacheData(row);
							if (returnData.result) {
								LayerUtil.warning(returnData["message"+layui.admin.lang()]);
							} else {
								viewForm({id: row.id,hashKey: row.hashKey})
							}
						},
						'click .edit': function (e, value, row, index) {
							var returnData = ProcUtil.isCacheData(row);
							if (returnData.result) {
								LayerUtil.warning(returnData["message"+layui.admin.lang()]);
							} else {
								row.procTaskPermission = returnData.taskPermission;
								addOrEdit({
									id: row.id,
									hashKey: row.hashKey,
									procDefKey: row.procDefKey,
									paramStr: ProcUtil.getParamStr(row)
								})
							}
						},
						'click .del': function (e, value, row, index) {
							delFuc(row);
						},
					},
					formatter: function(value, row, index) {
						return LayerUtil.getBtnsStrFromMenuData("",[{
							sign: "view",
							pageName: "查看",
							pageName_EN: "View"
						},{
							sign: "edit",
							pageName: "办理",
							pageName_EN: "Edit"

						}]).tableBtnsStr;
					},
                },
            ],
		},"demo_workflow","todoAndDoing");

		var bootstrapTableUtilDone = new BootstrapTableUtil("-done"+getTime, "", getTime);
		bootstrapTableUtilDone.initProc({
			url: admin.basePath + '/dynamic/zform/data?path=Done&traceFlag=&formNo=demo_workflow',
			method: 'post',
			columns: [
                {
					checkbox: true
				},
				{
					field: 's01',
					title: '名称',
					sortable: true,
					sortName: 'a.name',
					
					formatter:function(value, row , index){
						if(!value){
							value = "";
						}
						return "<a href='javascript:;' class='view'>"+value+"</a>"+"<a class='qu-kuai-lian' data-id='"+row.hashKey+"' data-name='s01'><i class='fa fa-link'></i></a>";
					},
					events: {
						'click .view': function (e, value, row, index) {
							var returnData = ProcUtil.isCacheView(row);
							if (returnData.result) {
								LayerUtil.warning(returnData["message"+layui.admin.lang()]);
							} else {
								viewForm({id: row.id,hashKey: row.hashKey})
							}
						}
					},
				},
				{
					field: 'area01.name',
					title: '行政区',
					sortable: true,
					sortName: 'a.administrative',
					
				},
				{
					field: 'd01',
					title: '注册日期',
					sortable: true,
					sortName: 'a.date_of_registration',
					
					formatter:function(value, row, index){
						return (typeof value == "undefined" || value == null || value == "") ? "" : moment(value).format('yyyy-MM-dd'.replace(/yy/g,"YY").replace(/dd/g,"DD"));
					},
				},
				{
					field: 'user01.name',
					title: '负责人',
					sortable: true,
					sortName: 'a.person_in_charge',
					
				},
				{
					field: 's03',
					title: '是否有效',
					sortable: true,
					sortName: 'a.is_it_effective',
					
					formatter:function(value, row , index){
						return myHelper.getValueFromDictionary("yes_no",value);
					},
				},
                {
                	title: layui.admin.lang() ? 'Operation' : '操作',
                	width: '45px',
					"class": 'center must',
					events: {
						'click .view': function (e, value, row, index) {
							var returnData = ProcUtil.isCacheView(row);
							if (returnData.result) {
								LayerUtil.warning(returnData["message"+layui.admin.lang()]);
							} else {
								viewForm({id: row.id,hashKey: row.hashKey})
							}
						},
						'click .edit': function (e, value, row, index) {
							var returnData = ProcUtil.isCacheView(row);
							if (returnData.result) {
								LayerUtil.warning(returnData["message"+layui.admin.lang()]);
							} else {
								row.procTaskPermission = returnData.taskPermission;
								addOrEdit({
									id: row.id,
									hashKey: row.hashKey,
									procDefKey: row.procDefKey,
									paramStr: ProcUtil.getParamStr(row)
								})
							}
						},
						'click .del': function (e, value, row, index) {
							delFuc(row);
						},
					},
					formatter: function(value, row, index) {
						return LayerUtil.getBtnsStrFromMenuData("",[{
							sign: "view",
							pageName: "查看",
							pageName_EN: "View"
						}]).tableBtnsStr;
					},
                },
            ],
		},"demo_workflow","done");

		var bootstrapTableUtilArr = [];
		bootstrapTableUtilArr.push(bootstrapTableUtilTodoAndDoing);
		bootstrapTableUtilArr.push(bootstrapTableUtilUnsent);
		bootstrapTableUtilArr.push(bootstrapTableUtilDone);

		$("#body-div"+getTime).find(".addBtn").on("click",function(){
			addOrEdit({
				id:'',
				procDefKey: $(this).attr("data-procdefkey"),
				paramStr: ProcUtil.getParamStr()
			});
		});
		$("#body-div"+getTime).find("#importBtn").on("click",function(){
			LayerUtil.openDialog({
				title: '导入',
				formLay : 'demo_workflow',
				height:"300px",
				setDataWithoutAjax : true,
				url: 'admin/import',
	            btn: ['上传', '关闭'],
	            btn_EN: ['import', 'close'],
	            loading: false,
	            func1:function(index,layero){
					var validateForm = $(layero).find("#inputForm").validate({});
	            	if(validateForm.form()){
						var data = myHelper.composeData($(layero).find("#inputForm"));
						LayerUtil.ajax({
							url : admin.basePath + '/dynamic/zform/impdata?parentFormNo=&uniqueId=&toCompany=&parentId=&formNo=demo_workflow'+'&fileId='+data.importExcel+'&loginName='+localStorage.getItem('bpmUser'),
							type : 'post',
							shade: true,
							success : function(res) {
								LayerUtil.success(res[LayerUtil.getMsgLang()]);
								bootstrapTableUtil.refresh();
								layui.layer.close(index);
							}
						});
	            	}
	            }
			})
		});
		$("#body-div"+getTime).find("#exportBtn").on("click",function(){
			var str = $("#body-div"+getTime).find("#searchForm").serialize();
			var dataH = myHelper.formParamsToObject(str);
			window.open(admin.basePath + '/dynamic/zform/expdata?path=path&traceFlag=&formNo=demo_workflow&parentId=&zformString=' + encodeURI(JSON.stringify(dataH)));
			return;
		});
		//撤销
		$("#body-div"+getTime).find(".cancelBtn").on("click",function(){
			var ids = bootstrapTableUtilDone.getSingleId();
			if(ids){
				LayerUtil.confirm(layui.admin.lang() ? "Are you sure?" : "确定撤销吗？", function(){
					LayerUtil.ajax({
						type: 'post',
		        		url: admin.basePath + '/dynamic/zform/revoke?formNo=demo_workflow&ids=' + ids,
		        		success: function(res){
		        			LayerUtil.success(res.data["message"+layui.admin.lang()]);
                			$.each(bootstrapTableUtilArr, function(i,item){
			    				item.refresh();
			    			})
		        		}
		        	})
				})
	       	}
		});
		//取回
		$("#body-div"+getTime).find(".backBtn").on("click",function(){
			var ids = bootstrapTableUtilDone.getSingleId();
			if(ids){
				LayerUtil.confirm(layui.admin.lang() ? "Are you sure?" : "确定取回吗？", function(){
					LayerUtil.ajax({
						type: 'post',
		        		url: admin.basePath + '/dynamic/zform/backward?formNo=demo_workflow&ids=' + ids,
		        		success: function(res){
		        			LayerUtil.success(res.data["message"+layui.admin.lang()]);
                			$.each(bootstrapTableUtilArr, function(i,item){
			    				item.refresh();
			    			})
		        		}
		        	})
				})
	       	}
		});

		/*
		$("#body-div"+getTime).find("#removeBtn").on("click",function(){
			var ids = bootstrapTableUtil.getMultiId();
			if(ids){
				LayerUtil.confirm(layui.admin.lang() ? "Are you sure?" : "确定删除吗？", function(){
					LayerUtil.ajax({
						type: 'post',
		        		url: admin.basePath + '/dynamic/zform/delete?formNo=demo_workflow&ids=' + ids,
		        		success: function(res){
		        			LayerUtil.success(res[LayerUtil.getMsgLang()]);
                			bootstrapTableUtil.refresh();
		        		}
		        	})
				})
	       	}
		});
		*/

		function addOrEdit(initData) {
			var id = initData ? initData.id : '';
			LayerUtil.openDialogFlow({
				title : layui.admin.lang() ? 'Edit ' : '编辑工作流演示',
				formLay : 'demo_workflow',
				initData : initData,
				setDataWidthAjax : true,
				actionDataName : 'data',
				url : 'admin/demo_workflow/form',
				actionUrl : admin.basePath + '/dynamic/zform/getZformWithAct?formNo=demo_workflow&id=' + id + '&procDefKey=' + initData.procDefKey,
	            func : function(index,layero,paramStr) {
	            	if(paramStr.type != "saveAndStart" && paramStr.type != "saveAndComplete") {
						$(layero).find(".required").removeClass("required");
					}
	            	$(layero).find("#requeridFormTab").trigger("click");
	            	var validateForm = $(layero).find("#inputForm").validate({});
	            	if(validateForm.form()){
		            	ProcUtil.getUserList(paramStr,bootstrapTableUtilArr);
	            	}
	            }
			})
		}

		function addChild(initData) {
			var id = initData ? initData.id : '';
			LayerUtil.openDialog({
				title : layui.admin.lang() ? 'Edit ' : '编辑工作流演示',
				formLay : 'demo_workflow',
				initData : initData,
				setDataWithoutAjax : true,
				actionDataName : 'data',
				url : 'admin/demo_workflow/form',
	            btn : ['保存', '取消'],
	            btn_EN : ['Save', 'Cancel'],
	            func1 : function(index,layero) {
	            	var validateForm = $(layero).find("#inputForm").validate({});
	            	if(validateForm.form()){
						var data = myHelper.composeData($(layero).find("#inputForm"));
						LayerUtil.ajax({
							url : admin.basePath + '/dynamic/zform/save',
							type : 'post',
							data : JSON.stringify(data),
							shade: true,
							success : function(res) {
								LayerUtil.success(res[LayerUtil.getMsgLang()]);
								bootstrapTableUtil.refresh();
								layui.layer.close(index);
							}
						});
					}
	            }
			})
		}

		function viewForm(initData) {
			LayerUtil.openDialogView({
				title : layui.admin.lang() ? 'View ' : '查看工作流演示',
				initData : initData,
				formLay : 'demo_workflow',
				url : 'admin/demo_workflow/form',
				actionUrl : admin.basePath + '/dynamic/zform/getZform?formNo=demo_workflow&id=' + initData.id,
				actionDataName : 'data',
				setDataWidthAjax : true,
			})
		}

		function delFuc(row){
    		LayerUtil.confirm(layui.admin.lang() ? 'Are you sure you want to delete?':'确认要删除吗？', function() {
				LayerUtil.ajax({
					url: admin.basePath + '/dynamic/zform/delete?formNo=demo_workflow&ids=' + row.id,
					type:'post',
	        		shade:true,
					success: function(res){
	        			LayerUtil.success(res[LayerUtil.getMsgLang()]);
	        			$.each(bootstrapTableUtilArr, function(i,item){
        					item.refresh();
		    			})
	        		}
				});
			});
    	}
    });
</script>


